<ion-app [ngStyle]="{'margin-top': statubarHeight }">
  <ion-split-pane [ngClass]="{
      'dark-theme': selectedTheme === 'dark-theme',
      'light-theme': selectedTheme !== 'dark-theme'
    }">
    <ion-menu>
      <ion-header>
        <ion-toolbar>
          <ion-title> {{ 'HOME.Menu' | translate }} </ion-title>
        </ion-toolbar>
      </ion-header>
      <ion-content>
        <ion-list>
          <ion-menu-toggle auto-hide="false">
            <ion-item button (click)="navigate('/tabs')">
              <ion-icon slot="start" name="home"></ion-icon>
              <ion-label> {{ 'HOME.Home' | translate }} </ion-label>
            </ion-item>
          </ion-menu-toggle>

          <ion-menu-toggle auto-hide="false">
            <ion-item button (click)="navigate('/tabs/(list:list)')">
              <ion-icon slot="start" name="information-circle"></ion-icon>
              <ion-label> {{ 'HOME.List' | translate }} </ion-label>
            </ion-item>
          </ion-menu-toggle>

          <ion-menu-toggle auto-hide="false">
            <ion-item button (click)="navigate('/tabs/(test:test)')">
              <ion-icon slot="start" name="hammer"></ion-icon>
              <ion-label> {{ 'HOME.Test' | translate }} </ion-label>
            </ion-item>
          </ion-menu-toggle>
        </ion-list>
      </ion-content>
    </ion-menu>

    <ion-router-outlet main></ion-router-outlet>
  </ion-split-pane>
</ion-app>